<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>ipa下载安装</title>
    </head>
    <body>
        <div class='top_bg'></div>
        <div class="top_tx">
            <h1>点击进行安装</h1>
            <h1>温馨提示：需配合「浪哩格浪～」一起食用</h1>
            <!--<a href="https://localhost:6888/install.ipa">访问应用文件</a>-->
            <!-- <p style="height: 100px;"> -->
            <img style="width: 350px;height: 350px; margin-top: 30px;" src="https://api.qrserver.com/v1/create-qr-code?data=https://angriso.gitee.io/angriso/other-install.html">
            <h3 class="install-tx" style="visibility: hidden;">正在安装...</h3>
            <h3 class="install-tx" style="visibility: hidden;">正在安装，请按 Home 键在桌面查看</h3>
        </div>
        </p>
        <div>
            <div class="clickBtn">
                <a id="down_btn" ><p>立即安装</p></a>
            </div>
        </div>
        <br/>
    </body>

    <script>
        document.querySelector("#down_btn").onclick = function (){
            setTimeout(() => {
                let eles = document.getElementsByClassName("install-tx");
                for (let t of eles) {
                    t.style.visibility = 'visible'; 
                }
            }, 2000);
            window.location.href="itms-services://?action=download-manifest&url=https://gitee.com/angriso/angriso/raw/master/other-Info.plist";
        };
    </script>
    <style>
         body{
            font-size: 20px;
        }
        .top_bg{
            /* height: 40px; */
            /* width: 100%; */
            /* background-repeat: repeat-x; */
            background: url(./top_bg_mobile.png) top center no-repeat;
            background-size: 100% auto;
            height: 100px;
        }
        .top_tx{
            height: 1000px;
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            align-items:  center;
        }
        .clickBtn a{
            color: white;
            text-decoration: none;
        }
        .clickBtn{
            text-align: center;
            width: 50%;
            height: 100px;
            margin-left: auto;
            margin-right: auto;
            background-color: #1abc9c;
            border-radius: 50px;
        }
        .clickBtn p{
            line-height: 100px;
            font-size: 30px;
        }
    </style>
</html>